<template>
  <BasicModal
    v-bind="$attrs"
    @register="registerModal"
    @ok="handleSubmit"
    :closeFunc="handleClose"
    showFooter
    title="生成代码"
    width="500px"
    :destroyOnClose="false"
  >
    <BasicForm @register="registerForm" class="mr-3" />
  </BasicModal>
</template>
<script lang="ts" setup>
  import { BasicForm, useForm } from '@/components/Form';
  import { BasicModal, useModal } from '@/components/Modal';
  import { ref } from 'vue';
  import { FormSchema } from '@/components/Table';
  import { generateJava } from '@/api/toolkit/genJava';
  import { useMessage } from '@/hooks/web/useMessage';

  const { createMessage } = useMessage();

  // 表单数据
  const formModel = ref<any>({});

  // 表单字段
  const formSchema: FormSchema[] = [
    {
      field: 'domain',
      label: 'domain',
      component: 'CheckboxGroup',
      defaultValue: ['hasDo'],

      componentProps: {
        options: [
          { label: 'po', value: 'hasPo' },
          { label: 'do', value: 'hasDo' },
          { label: 'query', value: 'hasQuery' },
          { label: 'request', value: 'hasRequest' },
        ],
      },
    },
    {
      field: 'mapper',
      label: 'mapper',
      component: 'CheckboxGroup',
      defaultValue: ['hasPo'],

      componentProps: {
        options: [
          { label: 'mapper', value: 'hasMapper' },
          { label: 'xml', value: 'hasMapperXml' },
        ],
      },
    },
    {
      field: 'service',
      label: 'service',
      component: 'CheckboxGroup',
      defaultValue: ['hasDo'],

      componentProps: {
        options: [
          { label: 'api', value: 'hasServiceApi' },
          { label: 'impl', value: 'hasService' },
        ],
      },
    },

    {
      field: 'controller',
      label: 'controller',
      component: 'CheckboxGroup',
      defaultValue: ['hasController'],

      componentProps: {
        options: [{ label: 'controller', value: 'hasController' }],
      },
    },
    {
      field: 'typescript',
      label: 'typescript',
      component: 'CheckboxGroup',
      defaultValue: ['hasDo'],

      componentProps: {
        options: [
          { label: 'tsType', value: 'tsType' },
          { label: 'tsApi', value: 'tsApi' },
        ],
      },
    },
    {
      field: 'vue',
      label: 'vue',
      component: 'CheckboxGroup',
      defaultValue: ['hasDo'],

      componentProps: {
        options: [
          { label: 'list', value: 'list' },
          { label: 'edit', value: 'edit' },
        ],
      },
    },
  ];
  // 注册表单
  const [registerForm, { validate, resetFields }] = useForm({
    labelWidth: 90,
    baseColProps: { span: 24, lg: 24 },
    showActionButtonGroup: false,
    schemas: formSchema,
    model: formModel,
  });

  // 注册弹窗
  const [registerModal, { openModal, closeModal }] = useModal();

  async function handleSubmit() {
    // 表单校验
    const formValues = await validate();

    const requestObj = { id: formModel.value.id };
    formValues.domain.forEach((item) => (requestObj[item] = true));
    formValues.service.forEach((item) => (requestObj[item] = true));
    formValues.mapper?.forEach((item) => (requestObj[item] = true));
    formValues.controller?.forEach((item) => (requestObj[item] = true));

    await generateJava(requestObj);

    createMessage.info('生成成功');

    // 关闭弹窗
    closeModal();

    // 重置表单
    resetFields();
  }

  function open(params: any) {
    // 初始化表单
    formModel.value = params;
    // 显示弹窗
    openModal();
  }

  function handleClose(): any {
    // 关闭之前:重置表单
    resetFields();
    return true;
  }

  defineExpose({
    open,
  });
</script>
